<template>
  <div class="app-container">
    <div style="display: flex;flex-flow: row nowrap;margin-left: 9%">
      <div style="border:1px;background-color: #4e8dff; width: 6px;height: 20px"></div>
      <span style="margin-left: 10px">培训信息</span>
    </div>
    <el-form ref="tempForm" :model="form" label-width="140px"
             style="margin-left: 25%;">
      <el-row>
        <el-col :span="16">
          <el-form-item label="培训标题" prop="title">
            <el-input v-model="form.title" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="16">
          <el-form-item label="培训内容" prop="contents">
            <editor v-model="form.contents" :readOnly="true" :min-height="192"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="16">
          <el-form-item label="附件" prop="attachFile">
            <file-upload v-model="form.attachFile" :isShowTip="false"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="16">
          <el-form-item label="培训时间" prop="trainingTime">
            <el-date-picker
              v-model="form.trainingTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
              default-time="9:00:00"
              style="width: 100%"
              disabled
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="16">
          <el-form-item label="培训地点" prop="trainingPlace">
            <el-input v-model="form.trainingPlace" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <examine-person-result-form ref="examinePersonResultRef" :pageForm="resultForm"></examine-person-result-form>
    <appr-records ref="apprRecordsRef" :examineId="id" :opreationType="2" ></appr-records>
    <div style="margin: 2% auto auto 40%;">
      <el-button class="form_button_item" @click="closeBtnHandler">返回</el-button>
    </div>
  </div>
</template>

<script>
import {evaluateApprove, getTraining} from "@/api/examine/training/api";
import approveSelectForm from "@/views/examine/approveSelectForm";
import examinePersonResultForm from "@/views/examine/examinePersonResultForm";
import approveForm from "@/views/examine/approveForm";
import apprRecords from "@/views/examine/apprRecords";
export default {
  name: "Add",
  components: {
    approveSelectForm,
    examinePersonResultForm,
    approveForm,
    apprRecords
  },
  data() {
    return {
      title: "",
      cycleVal: '',
      deptName: '',
      resultForm: {},
      isUpdate: false,
      rulesData: {},
      receiveData: {},
      saveBtnLoading: false,
      // 表单参数
      tempForm: {},
      form: {},
      id: ''
    }
  },
  created() {
    this.initPage();
  },
  methods: {
    initPage() {
      this.reset()
      this.id = this.$route.query.id;
      if (this.id) {
        this.isUpdate = true;
        getTraining(this.id).then(resp => {
          this.form = resp.data
          this.resultForm = resp.data
        })
      }
    },
    closeBtnHandler() {
      this.reset()
      // 关闭当前页面
      this.$tab.closeOpenPage();
      // 刷新列表页面
      this.$tab.refreshPage({path: "/training/evluateAppr"});
    },
    // 表单重置
    reset() {
      this.form = {
        missionDescribe: undefined,
        attachFile: undefined,
        isSubmitted: undefined,
        isReceived: undefined,
        status: undefined
      };
      this.resetForm("form");
    }
  }
}
</script>

<style scoped>
::v-deep .el-input.is-disabled .el-input__inner {
  background-color: #fff;
  color: #606266;
}

::v-deep .el-textarea.is-disabled .el-textarea__inner {
  background-color: #fff;
  color: #606266;
}

::v-deep .el-radio__input.is-disabled + span.el-radio__label {
  background-color: #fff;
  color: #606266;
}
</style>
